<template>
  <div class="map-wrapper">
    <baidu-map
      id="bm-view"
      class="bm-view"
      :center="center"
      :zoom="zoom"
      :scroll-wheel-zoom="true"
      @ready="handler"
    >
      <zone-overlay />
    </baidu-map>
  </div>
</template>

<script>
import zoneOverlay from './zoneOverlay.vue'
export default {
  components: { zoneOverlay },
  data() {
    return {
      center: { lng: 0, lat: 0 },
      zoom: 10,
      scrollwheelzoom: false
    }
  },

  created() {

  },

  methods: {
    handler({ BMap, map }) {
    // lng, lat 表示你要设置的经纬度
      this.$set(this.center, 'lng', 116.404)
      this.$set(this.center, 'lat', 39.915)
    }

  }
}
</script>

<style scoped lang='less'>

.map-wrapper{
  width: 100%;
  height: 100vh;
  background-color: pink;
}
.bm-view{
    width: 100%;
    height: 100%; /* for example */
}
</style>
